import { useState } from "react";


interface AddTodoProps { 
    addTodo: (text: string) => void;
    setFilter: (filter: string) => void;
}


function AddTodo({ addTodo, setFilter }: AddTodoProps) {
    const [text, setText] = useState('');

    const handleSubmit = (e: any) => {
        e.preventDefault();
        if(text.trim() === '') return;
        setText('');
        setFilter('all');
    }
    return (
        <form className="add-todo" onSubmit={handleSubmit}>
            <input type="text" placeholder="添加一个新的事项" className="add-input" value={text} onChange={(e) => setText(e.target.value)} />
            <button onClick={() => addTodo(text)} type="submit" className="add-btn" style={{ cursor: 'pointer' }}>新建事项</button>
        </form>
    )
}

export default AddTodo;